<template>
	<transition name="el-zoom-in-center">
		<div class="JNPF-preview-main">
			<div class="JNPF-common-page-header">
				<el-page-header @back="goBack" :content="!dataForm.id ? '新建' : isDetail ? '详情' : '编辑'"/>
				<div class="options">
					<el-button type="primary" @click="dataFormSubmit()" v-if="!isDetail">确 定</el-button>
					<el-button @click="goBack">取 消</el-button>
				</div>
			</div>
			<el-row :gutter="15"  class="main" :style="{margin: '0 auto',width:'100%'}">
			<el-form ref="elForm" :model="dataForm" size="medium" label-width="130px" label-position="right" :disabled="!!isDetail" :rules="rules">
				<el-col :span="12">
					<el-form-item label="事故名称" prop="sgmc" required >
						<el-input v-model="dataForm.sgmc" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
							<template slot="prepend"></template>
							<template slot="append"></template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="事故部门" prop="sgbm" required >
						<el-select v-model="dataForm.sgbm" placeholder="请选择" clearable :style='{"width":"100%"}' >
							<el-option v-for="(item, index) in sgbmOptions" :key="index" :label="item.F_FullName" :value="item.F_Id" ></el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="发生地点" prop="fsdd" required >
						<el-input v-model="dataForm.fsdd" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
							<template slot="prepend"></template>
							<template slot="append"></template>
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="发生时间" prop="fssj" required >
						<el-date-picker v-model="dataForm.fssj" placeholder="请选择" clearable :style='{"width":"100%"}' type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" >
						</el-date-picker>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="事故类别" prop="shlb" required >
						<el-select v-model="dataForm.shlb" placeholder="请选择" clearable :style='{"width":"100%"}' >
							<el-option v-for="(item, index) in shlbOptions" :key="index" :label="item.fullName" :value="item.id" ></el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="上报人" prop="sbr" required >
						<el-select v-model="dataForm.sbr" placeholder="请选择" clearable :style='{"width":"100%"}' >
							<el-option v-for="(item, index) in sbrOptions" :key="index" :label="item.F_RealName" :value="item.F_Id" ></el-option>
						</el-select>
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="快报附件" prop="kbfj" >
						<JNPF-UploadFz v-model="kbfjList" accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
						</JNPF-UploadFz>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="事故原因" prop="sgyy" required >
						<el-input v-model="dataForm.sgyy" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="人员伤亡情况" prop="ryswqk" required >
						<el-input v-model="dataForm.ryswqk" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
						</el-input>
					</el-form-item>
				</el-col>
				<el-col :span="24">
					<el-form-item label="事故描述" prop="sgms" required >
						<el-input v-model="dataForm.sgms" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
						</el-input>
					</el-form-item>
				</el-col>
				<template>
					<div v-if="shdetail">
						<el-col :span="12">
							<el-form-item label="流程编号" prop="flowNumber" >
								<el-input v-model="dataForm.flowNumber" placeholder="请输入" clearable disabled :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
									<template slot="prepend"></template>
									<template slot="append"></template>
								</el-input>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="事故等级" prop="sgdj" >
								<el-select v-model="dataForm.sgdj" placeholder="请选择" clearable :style='{"width":"100%"}' >
									<el-option v-for="(item, index) in sgdjOptions" :key="index" :label="item.fullName" :value="item.id" ></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="事故发现项" prop="sgfxx" >
								<el-input v-model="dataForm.sgfxx" placeholder="请输入" clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
									<template slot="prepend"></template>
									<template slot="append"></template>
								</el-input>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="整改责任人" prop="zgzrr" >
								<el-select v-model="dataForm.zgzrr" placeholder="请选择" clearable :style='{"width":"100%"}' >
									<el-option v-for="(item, index) in zgzrrOptions" :key="index" :label="item.F_RealName" :value="item.F_Id" ></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="建议完成期限" prop="jywcqx" >
								<el-date-picker v-model="dataForm.jywcqx" placeholder="请选择" clearable :style='{"width":"100%"}' type="date" format="yyyy-MM-dd" value-format="timestamp" >
								</el-date-picker>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="事故证据链" prop="sgzjl" >
								<JNPF-UploadFz v-model="sgzjlList" accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
								</JNPF-UploadFz>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="事故树分析表" prop="sgsfxb" >
								<JNPF-UploadFz v-model="sgsfxbList" accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
								</JNPF-UploadFz>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="最终调查报告" prop="zzdcbg" >
								<JNPF-UploadFz v-model="zzdcbgList" accept="" :fileSize="10" sizeUnit="MB" :limit="1" buttonText="点击上传" >
								</JNPF-UploadFz>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="审核状态" prop="shzt" >
								<el-select v-model="dataForm.shzt" placeholder="请选择" clearable :style='{"width":"100%"}' >
									<el-option v-for="(item, index) in shztOptions" :key="index" :label="item.fullName" :value="item.id" ></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="12">
							<el-form-item label="审批人" prop="spr" >
								<el-select v-model="dataForm.spr" placeholder="请选择" clearable :style='{"width":"100%"}' >
									<el-option v-for="(item, index) in sprOptions" :key="index" :label="item.F_RealName" :value="item.F_Id" ></el-option>
								</el-select>
							</el-form-item>
						</el-col>
						<el-col :span="24">
							<el-form-item label="火灾损失影响" prop="hzssyx" >
								<el-input v-model="dataForm.hzssyx" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
								</el-input>
							</el-form-item>
						</el-col>
						<el-col :span="24">
							<el-form-item label="危化品泄漏影响" prop="whpxlyx" >
								<el-input v-model="dataForm.whpxlyx" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
								</el-input>
							</el-form-item>
						</el-col>
						<el-col :span="24">
							<el-form-item label="设备事故影响" prop="sbsgyx" >
								<el-input v-model="dataForm.sbsgyx" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
								</el-input>
							</el-form-item>
						</el-col>
						<el-col :span="24">
							<el-form-item label="工艺事故影响" prop="gysgyx" >
								<el-input v-model="dataForm.gysgyx" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
								</el-input>
							</el-form-item>
						</el-col>
						<el-col :span="24">
							<el-form-item label="整改防范措施" prop="zgffcs" >
								<el-input v-model="dataForm.zgffcs" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
								</el-input>
							</el-form-item>
						</el-col>
						<el-col :span="24">
							<el-form-item label="审批意见" prop="spyj" >
								<el-input v-model="dataForm.spyj" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
								</el-input>
							</el-form-item>
						</el-col>
						<el-col :span="24">
							<el-form-item label="责任人处理结果" prop="zrrcljg" >
								<el-input v-model="dataForm.zrrcljg" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":1000}' >
								</el-input>
							</el-form-item>
						</el-col>
					</div>
				</template>
			</el-form>
			</el-row>
		</div>
	</transition>

</template>
<script>
import request from '@/utils/request'
import {getDictionaryDataSelector}from '@/api/systemData/dictionary'
import {previewDataInterface}from '@/api/systemData/dataInterface'
export default {
    data() {
      return {
        visible: false,
        isDetail: false,
        dataForm: {
					sgmc:undefined,
					sgbm:undefined,
					fsdd:undefined,
					fssj:undefined,
					shlb:undefined,
					sbr:undefined,
					kbfj:[],
					sgyy:undefined,
					ryswqk:undefined,
					sgms:undefined,
					flowNumber:undefined,
					sgdj:undefined,
					sgfxx:undefined,
					zgzrr:undefined,
					jywcqx:undefined,
					sgzjl:[],
					sgsfxb:[],
					zzdcbg:[],
					shzt:undefined,
					spr:undefined,
					hzssyx:undefined,
					whpxlyx:undefined,
					sbsgyx:undefined,
					gysgyx:undefined,
					zgffcs:undefined,
					spyj:undefined,
					zrrcljg:undefined,

        },
        rules: {
						sgmc:[
						{
							required:true,
							message:'请输入事故名称',
							trigger:'blur'
						},
						],
						sgbm:[
						{
							required:true,
							message:'请输入事故部门',
							trigger:'blur'
						},
						],
						fsdd:[
						{
							required:true,
							message:'请输入发生地点',
							trigger:'blur'
						},
						],
						fssj:[
						{
							required:true,
							message:'请输入发生时间',
							trigger:'blur'
						},
						],
						shlb:[
						{
							required:true,
							message:'请输入事故类别',
							trigger:'blur'
						},
						],
						sbr:[
						{
							required:true,
							message:'请输入上报人',
							trigger:'blur'
						},
						],
						sgyy:[
						{
							required:true,
							message:'请输入事故原因',
							trigger:'blur'
						},
						],
						ryswqk:[
						{
							required:true,
							message:'请输入人员伤亡情况',
							trigger:'blur'
						},
						],
						sgms:[
						{
							required:true,
							message:'请输入事故描述',
							trigger:'blur'
						},
						],

        },
				sgbmOptions:[],
				shlbOptions:[{"fullName":"人员伤亡事故","id":"0"},{"fullName":"火灾爆炸事故","id":"1"},{"fullName":"危化品泄漏事故","id":"2"},{"fullName":"设备事故","id":"3"},{"fullName":"工艺事故","id":"4"}],
				sbrOptions:[],
				sgdjOptions:[{"fullName":"特别重大","id":"0"},{"fullName":"重大","id":"1"},{"fullName":"较大","id":"2"},{"fullName":"一般","id":"3"}],
				zgzrrOptions:[],
				shztOptions:[{"fullName":"待审核","id":"-1"},{"fullName":"已通过","id":"1"},{"fullName":"未通过","id":"0"}],
				sprOptions:[],

					kbfjList:[],
					sgzjlList:[],
					sgsfxbList:[],
					zzdcbgList:[],
		shdetail: false			

      }
    },
    created() {
		this.getsgbmOptions();
		this.getsbrOptions();
		this.getzgzrrOptions();
		this.getsprOptions();

    },
    methods: {
		getsgbmOptions()
		{
			previewDataInterface('772d2cbcadd24df79243e3d92ef5f690').then(res => {
				this.sgbmOptions = res.data
			})
		},
		getsbrOptions()
		{
			previewDataInterface('8bca424f16d6448ab09e57a028853aa9').then(res => {
				this.sbrOptions = res.data
			})
		},
		getzgzrrOptions()
		{
			previewDataInterface('8bca424f16d6448ab09e57a028853aa9').then(res => {
				this.zgzrrOptions = res.data
			})
		},
		getsprOptions()
		{
			previewDataInterface('8bca424f16d6448ab09e57a028853aa9').then(res => {
				this.sprOptions = res.data
			})
		},

           goBack() {
                    this.$emit('refresh')
                },
      init(id, isDetail) {
		if(isDetail == true){
			this.shdetail = true;
		}
        this.dataForm.id = id || 0;
        this.visible = true;
        this.isDetail = isDetail || false;
        this.$nextTick(() => {
          this.$refs['elForm'].resetFields();
          if (this.dataForm.id) {
            request({
              url: '/api/System/qyaqscSgbgxx/' + this.dataForm.id,
              method: 'get'
            }).then(res =>{
              this.dataForm = res.data;
				this.kbfjList = this.dataForm.kbfj ? JSON.parse(this.dataForm.kbfj) : [];
				this.sgzjlList = this.dataForm.sgzjl ? JSON.parse(this.dataForm.sgzjl) : [];
				this.sgsfxbList = this.dataForm.sgsfxb ? JSON.parse(this.dataForm.sgsfxb) : [];
				this.zzdcbgList = this.dataForm.zzdcbg ? JSON.parse(this.dataForm.zzdcbg) : [];

            })
          }
        })
      },
      // 表单提交
      dataFormSubmit() {
				this.$set(this.dataForm, 'kbfj', JSON.stringify(this.kbfjList));
				this.$set(this.dataForm, 'sgzjl', JSON.stringify(this.sgzjlList));
				this.$set(this.dataForm, 'sgsfxb', JSON.stringify(this.sgsfxbList));
				this.$set(this.dataForm, 'zzdcbg', JSON.stringify(this.zzdcbgList));

        this.$refs['elForm'].validate((valid) => {
          if (valid) {
            if (!this.dataForm.id) {
              request({
                url: '/api/System/qyaqscSgbgxx',
                method: 'post',
                data: this.dataForm,
              }).then((res) =>{
                this.$message({
                  message: res.msg,
                  type: 'success',
                  duration: 1000,
                  onClose: () =>{
                    this.visible = false;
                    this.$emit('refresh', true);
                  }
                })
              })
            } else {
              request({
                url: '/api/System/qyaqscSgbgxx/' + this.dataForm.id,
                method: 'PUT',
                data: this.dataForm
              }).then((res) =>{
                this.$message({
                  message: res.msg,
                  type: 'success',
                  duration: 1000,
                  onClose: () =>{
                    this.visible = false;
                    this.$emit('refresh', true);
                  }
                })
              })
            }
          }
        })
      },

    }
  }
  </script>